<div class="layuimini-container">
    <div class="layuimini-main">
        <div class="layui-form">
            <div class="layui-input-inline">
                <button class="layui-btn layui-btn-primary" data-page="page/pri/add.html"
                        data-click="common_add_click" data-callback="role_menu">
                    <i class="layui-icon layui-icon-add-1 layui-btn-icon"></i>添加权限</button>
            </div>
            <div class="layui-input-inline">
                <button class="layui-btn layui-btn-primary common-reload">
                    <i class="layui-icon-refresh-3 layui-btn-icon layui-icon"></i>重新加载</button>
            </div>
            <div class="layui-input-inline" style="width: 460px">
                <input type="text" name="key" required  placeholder="从说明或URL里搜索" class="layui-input">
            </div>
            <div class="layui-input-inline" id="common-clear-input" style="margin-left: -30px;cursor: pointer;margin-right: 5px;">
                <i class="layui-icon layui-icon-close"></i></div>
            <div class="layui-input-inline">
                <button class="layui-btn layui-btn-primary common-search"><i class="layui-icon layui-icon-search"></i></button>
            </div>
            <div class="layui-input-inline red" id="common-search-tips"></div>
        </div>
        <table class="layui-hide" id="pri-table" lay-filter="pri-table"></table>
        <script type="text/html" id="pri-bar">
            <a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="edit">编辑</a>
            <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">删除</a>
        </script>
    </div>
</div>
</div>
<script>
    tb = table.render({
        elem: '#pri-table',
        url: '/admin/pri/admin.htm',
        cols: [[
            {field: 'id', width: 60, title: 'ID', sort: true},
            {field: 'url', width: 350, title: 'URL',templet:function(e){
                    if( search_key )
                    {
                        return search_reg(search_key,e.url);
                    }
                    return e.url
                } },
            {field: 'desc', width:350,title: '说明',templet:function(e){
                    if( search_key )
                    {
                        return search_reg(search_key,e.desc);
                    }
                    return e.desc;
                }},
            {field:'title',width:120,title:'所属菜单'},
            {title: '操作', width: 120, templet: '#pri-bar', align:"right"}
        ]]
    })
    table.on('tool(pri-table)',function(obj){
        const data = obj.data,
            role_menu_id = data.role_menu_id;
        if( obj.event === 'edit' ){
            http.getHtml('page/pri/add.html',function(res){
                window.openBox = layer.open({
                    type:1,
                    area:['600px','500px'],
                    content:res,
                    success:function(e){
                        if( +role_menu_id > 0 ){
                            $('#role-menu').attr('data-checked-id',role_menu_id);
                        }
                        $(e).find('legend').text('修改权限')
                        layuimini.render($(e),data);
                        role_menu(role_menu_id,http,tree)
                    }
                })
            })
        }
        else if ( obj.event === 'del'){
            layer.confirm('你确定要删除？',function(index){
                http.get('/admin/pri/del_admin_pri.htm?id='+data.id).done(function(res){
                    if(res.code == 200) {
                        obj.del();
                        layer.close(index)
                    }
                    layer.msg(res.msg)
                })
            })
        }
    })

    /**
     * 保存修改或新增的权限
     */
    window.save_role_pri = function(){
        const data = {
            url:$('input[name="url"]').val(),
            desc:$('input[name="desc"]').val(),
            role_menu_id:$('#role-menu').attr('data-checked-id'),
            id:$('input[name="id"]').val()
        };
        if( !data.url || !data.role_menu_id || !data.desc){
            layer.alert('每一项都必须填写！');
            return ;
        }
        http.post('/admin/pri/save.htm',{data:data}).done(function(res){
            if(res.code === 200){
                layer.close(openBox)
                setTimeout(function(){
                    tb.reload();
                },600)
            }
        })
    };

    function role_menu (role_menu_id = 0){
        http.get('/admin/role_menu/find_tree.htm').done(function(res){
            tree.render({
                elem: '#role-menu',
                data: res.result, //数据源
                id: 'menu-box' ,//定义索引
                showLine:false,
                accordion:true,
                click: function(obj){
                    if(obj.data.children === undefined){
                        const icon = '<i class="layui-icon layui-icon-ok lm5"></i>';
                        $('#role-menu').attr('data-checked-id',obj.data.id);
                        $('#role-menu').find('.layui-bg-gray').removeClass('layui-bg-gray')
                            .find('.layui-tree-txt > i').remove()
                        $(obj.elem).addClass('layui-bg-gray').find('.layui-tree-txt').append(icon)
                    }
                }
            });
            tree.setChecked('menu-box',role_menu_id,true)
        })
    }
</script>